import * as echarts from '../../components/ec-canvas/echarts'; //引入echarts.js
var dataList = [];
Page({
    data: {
        ec: {
            lazyLoad: true // 图标延迟加载
        },
        scanCodeState: false,
    },
    onLoad() {
        this.getData(); // 后台接口获取数据
    },
    changeState(){
        this.setData({
            scanCodeState: true
        })
    },
    goDetail(){
        wx.navigateTo({
            url: '/pages/index/outline/outline'
          })
    },
    goCalendar(){
        wx.navigateTo({
            url: '/pages/index/calendar/calendar'
          })
    },
    // 点击遮罩层关闭弹窗
    maskHide(){
        this.setData({
            scanCodeState: false
        })
    },
    openScanCode() {
        wx.scanCode({
            success(res) {
                console.log(res)
            }
        })
    },
    getData: function () {
        this.init_echarts(); //初始化图表
    },
    //初始化图表
    init_echarts: function () {
        this.selectComponent('#mychart').init((canvas, width, height) => {
            const Chart = echarts.init(canvas, null, {
                width: width,
                height: height
            });
            Chart.setOption(this.getOption());
            // 注意这里一定要返回 chart 实例，否则会影响事件处理等
            return Chart;
        });
        this.selectComponent('#mychart1').init((canvas, width, height) => {
            const Chart = echarts.init(canvas, null, {
                width: width,
                height: height
            });
            Chart.setOption(this.getOption());
            // 注意这里一定要返回 chart 实例，否则会影响事件处理等
            return Chart;
        });
    },
    getOption: function () {
        var colorListArr = ["#a7aba1", "#18a43d", "#0099db", "#FF9806", '#fff100', '#c9080b'];
        var option = {
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'shadow'
                },
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                top: '8%',
                containLabel: true
            },
            xAxis: {
                type: 'category',
                data: ['1', '', '', '', '5', '', '', '', '', '10', '', '', '', '', '15'],
                splitLine: {
                    show: false
                },
                axisLabel: {
                    interval: 0,
                    rotate: 0, // 如果X轴文字过长，坐标轴斜着显示
                    textStyle: {
                        color: "#999999",
                        fontSize: '12'
                    },
                },
                axisTick: {
                    show: false
                },
                axisLine: {
                    show: false
                }
            },
            yAxis: {
                axisLine: {
                    show: true,
                },
                axisLabel: {
                    show: true,
                    textStyle: {
                        color: "#999999",
                    },
                },
                splitLine: {
                    show: true,
                    lineStyle: {
                        color: "rgba(131,101,101,0.2)",
                        type: "dashed",
                    },
                },
            },
            series: {
                z: 2,
                name: "动值",
                type: "bar",
                data: [12, 23, 44, 54, 80, 125, 166, 188, 252, 260, 110, 100, 60, 30, 10].map((item, i) => {
                    let oColor = '';
                    if (item <= 50) {
                        oColor = colorListArr[0]
                    } else if (50 < item && item <= 100) {
                        oColor = colorListArr[1]
                    } else if (100 < item && item <= 150) {
                        oColor = colorListArr[2]
                    } else if (150 < item && item <= 200) {
                        oColor = colorListArr[3]
                    } else if (200 < item && item <= 250) {
                        oColor = colorListArr[4]
                    } else if (250 < item) {
                        oColor = colorListArr[5]
                    }
                    let itemStyle = {
                        color: oColor,
                    };
                    return {
                        value: item,
                        itemStyle: itemStyle,
                    };
                }),
                label: {
                    show: false,
                },
            },
        }
        return option
    }
})